<!DOCTYPE html>
<html lang="zh-Hans-CN" xmlns:th="http://www.thymeleaf.org">
<head>
  <th:block th:include="include :: header"/>
  <link th:href="@{/admin/css/other/console2.css}" rel="stylesheet"/>
  <title>监控</title>
</head>
<body class="pear-container">
<div class="layui-row layui-col-space10">
  <div class="layui-col-md8">
    <div class="layui-row layui-col-space10">
      <div class="layui-col-md6">
        <div class="layui-card">
          <div class="layui-card-header">
            CPU 信息
          </div>
          <div class="layui-card-body">
            <div class="layui-row layui-col-space10">
              <div class="layui-col-md6 layui-col-sm6 layui-col-xs6">
                <div class="pear-card2">
                  <div class="title">核心数</div>
                  <div class="count pear-text" th:text="${info.cpu.num}"></div>
                </div>
              </div>
              <div class="layui-col-md6 layui-col-sm6 layui-col-xs6">
                <div class="pear-card2">
                  <div class="title">空闲率</div>
                  <div class="count pear-text" th:text="${info.cpu.free}"></div>
                </div>
              </div>
              <div class="layui-col-md6 layui-col-sm6 layui-col-xs6">
                <div class="pear-card2">
                  <div class="title">等待率</div>
                  <div class="count pear-text" th:text="${info.cpu.wait}"></div>
                </div>
              </div>
              <div class="layui-col-md6 layui-col-sm6 layui-col-xs6">
                <div class="pear-card2">
                  <div class="title">使用率</div>
                  <div class="count pear-text" th:text="${info.cpu.used}"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="layui-col-md6">
        <div class="layui-card">
          <div class="layui-card-header">
            JVM 内存监控
          </div>
          <div class="layui-card-body">
            <div class="layui-row layui-col-space10">
              <div class="layui-col-md6 layui-col-sm6 layui-col-xs6">
                <div class="pear-card2">
                  <div class="title">已占用内存</div>
                  <div class="count pear-text" th:text="${info.memory.total}"></div>
                </div>
              </div>
              <div class="layui-col-md6 layui-col-sm6 layui-col-xs6">
                <div class="pear-card2">
                  <div class="title">最大可占用内存</div>
                  <div class="count pear-text" th:text="${info.memory.max}"></div>
                </div>
              </div>
              <div class="layui-col-md6 layui-col-sm6 layui-col-xs6">
                <div class="pear-card2">
                  <div class="title">暂未使用内存</div>
                  <div class="count pear-text" th:text="${info.memory.free}"></div>
                </div>
              </div>
              <div class="layui-col-md6 layui-col-sm6 layui-col-xs6">
                <div class="pear-card2">
                  <div class="title">内存使用率</div>
                  <div class="count pear-text"
                       th:text="${info.memory.usage}"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="layui-col-md12">
        <div class="layui-card">
          <div class="layui-card-header">主机信息</div>
          <div class="layui-card-body">
            <table class="layui-table" lay-skin="line">
              <thead>
              <tr>
                <th>属性</th>
                <th>值</th>
              </tr>
              </thead>
              <tbody>
              <tr>
                <td>服务器信息</td>
                <td th:text="${info.system.server}"></td>
              </tr>
              <tr>
                <td>操作系统</td>
                <td th:text="${info.system.osName}"></td>
              </tr>
              <tr>
                <td>系统架构</td>
                <td th:text="${info.system.osArch}"></td>
              </tr>
              <tr>
                <td>项目部署路径</td>
                <td th:text="${info.system.userDir}"></td>
              </tr>
              <tr>
                <td>Java 虚拟机</td>
                <td th:text="${info.system.jvmName}"></td>
              </tr>
              <tr>
                <td>JDK</td>
                <td th:text="${info.system.jvmVersion}"></td>
              </tr>
              <tr>
                <td>Java Home</td>
                <td th:text="${info.system.javaHome}"></td>
              </tr>
              <tr>
                <td>JVM 启动时间</td>
                <td th:text="${info.system.jvmStartTime}"></td>
              </tr>
              <tr>
                <td>JVM 运行时间</td>
                <td th:text="${info.system.jvmRunTime}"></td>
              </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="layui-col-md4">
    <div class="layui-card">
      <div class="layui-card-header">磁盘信息</div>
      <div class="layui-card-body">
        <ul class="pear-card-status">
          <li th:each="sysFile : ${info.disk}">
            <p th:text="${sysFile.name}"></p>
            磁盘大小&nbsp;<span th:text="${sysFile.total}"></span>&nbsp;&nbsp;
            空闲大小&nbsp;<span th:text="${sysFile.free}"></span>&nbsp;&nbsp;
            <br/>
            <br/>
            已经使用&nbsp;<span th:text="${sysFile.used}"></span>&nbsp;&nbsp;
            使用概率&nbsp;<span th:text="${sysFile.usage}"></span>
            <br/>
          </li>
        </ul>
      </div>
    </div>
  </div>
</div>
<th:block th:include="include :: footer"/>
</body>
</html>
